<template>
	<view class="luntan">
		<view class="status_bar">
			<!-- 这里是状态栏 -->
		</view>
		<!-- <view class="">
			{{arr}}
		</view> -->
		<!-- to_pinglun(item.id,item.dianzanshu,item.pinglunshu,item.shoucangshu) -->
		<view class="luntan-box" v-for="(item,index) in luntanLists" :key="index" >
			<view class="luntan-word1" @click="to_pinglun(item.id,item.dianzanshu,item.pinglunshu,item.shoucangshu)">
				{{item.title}}
			</view>
			<image :src="item.imagetouxian" class="luntan-touxiang" mode="" @click="to_pinglun(item.id,item.dianzanshu,item.pinglunshu,item.shoucangshu)"></image>
			<image :src="item.imagetupian" class="luntan-img" mode="" @click="to_pinglun(item.id,item.dianzanshu,item.pinglunshu),item.shoucangshu"></image>
			<view class="luntan-username" @click="to_pinglun(item.id,item.dianzanshu,item.pinglunshu,item.shoucangshu)">
				{{item.username}}
			</view>
			<view class="luntan-word2" @click="to_pinglun(item.id,item.dianzanshu,item.pinglunshu,item.shoucangshu)">
				{{item.content}}
			</view>
			<view class="luntan-icon">

				<view class="luntan-dianzan">
					<uni-icons type="chatbubble" size="20" color="#ccc"></uni-icons>
					<view class="icon-word">
						{{item.pinglunshu}}
					</view>
				</view>
				<view class="luntan-dianzan" @click="dianzan(item.dz,item.dianzanshu,index)">
					<uni-icons type="hand-up-filled" size="20" :color="item.dz?'#bc494a':'#ccc'"></uni-icons>
					<view class="icon-word"> {{item.dianzanshu}} </view>
				</view>
				<view class="luntan-dianzan" @click="shoucang(item.sc,item.shoucang,index)">
					<uni-icons type="star-filled" size="20" :color="item.sc?'#ffff00':'#ccc'"></uni-icons>
					<view class="icon-word">
						{{item.shoucangshu}}
					</view>
				</view>

			</view>
		</view>
	</view>

	</view>
</template>

<script>
	var hit = 0;
	// var that ;
	export default {
		components: {},
		data() {
			return {
				checkList: false,
				luntanList: [],
				iconDianz: false,
				arr:[],
				luntanLists: [],
				kkk: ""
			}
		},
		mounted() {
			var that = this;
			uni.request({
				url: 'http://127.0.0.1:8080/luntandata/luntandatalist', //仅为示例，并非真实接口地址。
				method: 'GET',
				dataType:'json',
				data: {

				},
				header: {
					// 'custom-header': 'hello' //自定义请求头信息
				},
				success: (res) => {
					// console.log(res.data.data);
					that.luntanLists = res.data.data;
					// console.log(that.luntanLists);
				
				}
			});
			uni.request({
				url:'http://127.0.0.1:8080/kapianimg/kapianimglist',
				method: 'GET',
				dataType:'json',
				data: {
				
				},
				header: {
					// 'custom-header': 'hello' //自定义请求头信息
				},
				success: (res) => {
					// console.log(res.data.data);
					that.arr = res.data.data;
					// console.log(that.arr);
				}
			})
		},
		methods: {
			qinqiu() {
			},
			favClick() {
				this.checkList = !this.checkList;
				this.$forceUpdate()
			},
			DianzClick(id) {
				console.log(hit++)
			},
			dianzan(e, num, index) {
				// console.log(e);
				// console.log(num);
				// console.log(index);
				if (!e) {
					this.luntanLists[index].dianzanshu++;
					this.luntanLists[index].dz = !e;
				} else {
					--this.luntanLists[index].dianzanshu;
					this.luntanLists[index].dz = !e;
				}
			},
			to_pinglun(index,dz,pl,sc){
				console.log(index);
				console.log(dz);
				console.log(pl);
				console.log(sc);
				switch(index){
					case 1:
					uni.navigateTo({
						url:'../../pages/shouye/luntan/luntanone?id='+index+'&dz='+dz+'&pl='+pl
					});
					break;
					case 2:
					uni.navigateTo({
						url:"../../pages/shouye/anniu/baodian"
					});
					break;
				}
			},
			shoucang(e, num, index) {
				// console.log(e);
				// console.log(num);
				// console.log(index);
				if (!e) {
					++this.luntanLists[index].shoucangshu;
					this.luntanLists[index].sc = !e;
				} else {
					--this.luntanLists[index].shoucangshu;
					this.luntanLists[index].sc = !e;
				}
			}
			// ,
			// goto(index) {
			// 	uni.navigateTo({
			// 		url: "../../pages/shouye/anniu/baodian?id=" + index
			// 	})
			// }
		}

	}
</script>

<style>
	page {
		background-image: url(@/static/bg.png);
		background-repeat: no-repeat;
		background-attachment: fixed;
		background-size: 100% 100%;
	}

	* {
		padding: 0%;
		margin: 0%;
	}

	image {
		display: flex;
	}

	.luntan {
		width: 100%;
		background-color: white;
		margin-top: 90rpx;
		padding-bottom: 80px;
	}

	.luntan-box {
		width: 90%;
		height: 580rpx;
		margin: auto;
		margin-top: 20rpx;
	}

	.luntan-box {
		width: 90%;
		height: 270rpx;
		border-bottom: 1px #ccc solid;
		position: relative;
	}

	.luntan-word1 {
		font-size: 30rpx;
		font-weight: bold;
		position: absolute;
		top: 5rpx;
		left: 10rpx;
	}

	.luntan-touxiang {
		width: 60rpx;
		height: 60rpx;
		border-radius: 50rpx;
		position: absolute;
		top: 55rpx;
		left: 10rpx;
	}

	.luntan-username {
		position: absolute;
		top: 65rpx;
		left: 85rpx;
		font-size: 30rpx;
	}

	.luntan-word2 {
		width: 470rpx;
		height: 68rpx;
		position: absolute;
		top: 135rpx;
		left: 10rpx;
		overflow: hidden;
		
		font-size: 25rpx;
	}

	.luntan-img {
		width: 150rpx;
		height: 150rpx;
		position: absolute;
		top: 40rpx;
		right: 10rpx;
	}

	.luntan-icon {
		width: 500rpx;
		height: 40rpx;
		display: flex;
		position: absolute;
		top: 205rpx;
		margin-right: 10rpx;
		font-size: 10rpx;
		line-height: 40rpx;

	}

	.icon-word {
		padding-left: 10rpx;
		padding-right: 10rpx;
	}

	.luntan-dianzan {
		width: 80rpx;
		display: flex;
	}
</style>
